<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<style>
		p{
			border: 1px solid red;
		    font-size: 16px;/*文字默认大小*/
			line-height: 20px;/*浮动p块元素,内容行内元素*/
			/*结论：文本不能浮动，特点：块包行*/
		}	
		img{
			border: 10x solid red;
			float: left;
		}
		</style>
		<title>浮动情景1：图片与文字环绕</title>
		<img src="img/花1.png" alt="hua1" width="250px" height="250px">
		<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere minus eos dolore quo esse sed dolorem consequatur sapiente eaque numquam sit cupiditate beatae culpa modi delectus eius, facilis, nulla perferendis. Lorem ipsum dolor sit amet consectetur adipisicing elit. Sequi eligendi hic excepturi aut officia asperiores pariatur obcaecati! Obcaecati cumque nostrum iste error nihil, fugit numquam fuga tempore dolores debitis a. Lorem ipsum dolor sit amet consectetur adipisicing elit. Quia fugit voluptatem expedita. Exercitationem assumenda odio rerum necessitatibus aperiam alias est fuga cupiditate, ipsum, distinctio delectus! Sequi odio sit corrupti suscipit. Lorem ipsum dolor sit amet consectetur adipisicing elit. Eveniet ex, voluptatibus veniam eaque cupiditate placeat consequuntur error? Officiis blanditiis sapiente autem cum totam libero! Placeat dignissimos sed accusantium ab sapiente.
		</p>
	</head>
	<body>
	</body>
</html>